<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    <input type="text" id="num1">
    <select id="fh">
        <option value="+">+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
        <option value="%">%</option>
    </select>
    <input type="text" id="num2">
    <input type="button" value="=" id="btn">
    <input type="text" readonly id="result">
</body>
<script>
    
    var num1 = document.getElementById("num1");
    var num2 = document.getElementById("num2");
    var fh = document.getElementById("fh");
    var btn = document.getElementById("btn");
    var res = document.getElementById("result");
    
    
    btn.onclick = function(){
        // 获取输入框中的内容
        var n1 = num1.value-0;
        var n2 = num2.value-0;
        var f = fh.value;

        var sum = 0;
        // 根据得到的符号，决定执行什么运算
        switch(f){
            case "+":
                sum = n1 + n2;
                break;
            case "-":
                sum = n1 - n2;
                break;
            case "*":
                sum = n1 * n2;
                break;
            case "/":
                sum = n1 / n2;
                break;
            case "%":
                sum = n1 % n2;
                break;
        }
        // 将运算结果存入输入框(设置)
        res.value = sum;
    }


</script>
</html>